<template>
    <a-table :columns="columns" :data-source="data"
        :customRow="record => { return { onClick: () => handleClick(record) } }" style="margin-top: 40px;">
        <template #bodyCell="{ column, record }">
            <template v-if="column.dataIndex == 'orderg_state'" >
                    <span :style="{'color':share.color}" v-if="record.orderg_state == 1">已支付未接单</span>
                    <span :style="{'color':share.color}" v-if="record.orderg_state == 2">已接单未出发</span>
                    <span :style="{'color':share.color}" v-if="record.orderg_state == 3">已出发未到达</span>
                    <span :style="{'color':share.color}" v-if="record.orderg_state == 4">已到达</span>
            </template>
        </template>
    </a-table>
    <a-modal v-model:visible="visible" title="规则修改" :width="740" okText="确定修改" @ok="setOk" :destroyOnClose="true">
        <a-form ref="setForm" :model="setFormState" name="dynamic_rule">
            <a-form-item label="扣除订单%" name="deduct_orderg" :rules="[{ validator: validayeNUmber }]">
                <a-input-number v-model:value="setFormState.deduct_orderg" />
            </a-form-item>
            <a-form-item label="扣除车费%" name="deduct_fare" :rules="[{ validator: validayeNUmber }]">
                <a-input-number v-model:value="setFormState.deduct_fare" />
            </a-form-item>
            <a-form-item label="扣除空单(元)" name="deduct_empty" :rules="[{ validator: validaye }]">
                <a-input-number v-model:value="setFormState.deduct_empty" />
            </a-form-item>
            <a-form-item label="扣除其他(元)" name="deduct_other" :rules="[{ validator: validaye }]">
                <a-input-number v-model:value="setFormState.deduct_other" />
            </a-form-item>
        </a-form>
    </a-modal>
</template>



<script setup>
import { ref, onMounted, reactive } from 'vue'


import { useUserData } from '../../../stores/userData';
import { useRouter } from 'vue-router';
import share from '../../../util/commnet'
import { message } from 'ant-design-vue';

import { payRuleAPI } from '../../../api/set';


const store = useUserData();
const router = useRouter();

const data = ref([]);
const columns = [{   //表格头部
    title: '订单状态规则',
    dataIndex: 'orderg_state',
    key: 'orderg_state',
    fixed: 'left',
}, {
    title: '扣除订单(%)',
    dataIndex: 'deduct_orderg',
    key: 'deduct_orderg',
    fixed: 'left',

}, {
    title: '扣除车费(%)',
    dataIndex: 'deduct_fare',
    key: 'deduct_fare',
}, {
    title: '扣除空单费',
    dataIndex: 'deduct_empty',
    key: 'deduct_empty',
},
{
    title: '扣除其他',
    dataIndex: 'deduct_other',
    key: 'deduct_other',
}];

const visible = ref(false);
const danData = ref({});
const handleClick = (item) => {
    setFormState.value = JSON.parse(JSON.stringify(item))
    visible.value = true;
}

const setForm = ref(null);
const setFormState = ref({});

const validayeNUmber = (rule, value) => {

    if (value >= 0 && value <= 100) {
        return Promise.resolve()
    } else {
        return Promise.reject("不能小于0,且不能大于100")
    }
}
const validaye = (rule, value) => {

    if (value >= 0) {
        return Promise.resolve()
    } else {
        return Promise.reject("不能小于0")
    }
}

const setOk = () => {
    setForm.value.validateFields()
        .then(async (r) => {
            let res = await payRuleAPI(`set|${setFormState.value.orderg_state}|${setFormState.value.deduct_orderg}|${setFormState.value.deduct_empty}|${setFormState.value.deduct_fare}|${setFormState.value.deduct_other}|${store.data.token}|${store.data.uuid}|${store.data.phone}`);
            if (!res || res.code == 406) {
                message.error("账号失效");
                router.replace({ name: 'login' });
                return;
            } else if (res.code != 200) {
                message.error(res.message);
                return
            }
            let cx = await payRuleAPI(`sel|${store.data.token}|${store.data.uuid}|${store.data.phone}`);
            if (!cx || cx.code == 406) {
                message.error("账号失效");
                router.replace({ name: 'login' });
                return;
            } else if (cx.code != 200) {
                message.error(cx.message);
                return
            }
            message.success("修改完成");
            data.value = cx.data;
            visible.value = false;
        })
}
onMounted(async () => {
    let res = await payRuleAPI(`sel|${store.data.token}|${store.data.uuid}|${store.data.phone}`);
    console.log(res);
    if (!res || res.code == 406) {
        message.error("账号失效");
        router.replace({ name: 'login' });
        return;
    } else if (res.code != 200) {
        message.error(res.message);
        return
    }
    data.value = res.data;
})

</script>


<style scoped src="../../css/set/payRules.scss" />